import { defineStore } from "pinia";
import { defaultSettings } from "../../../defaultSetting.ts";

export const useSettings = defineStore("settings", () => {
  // 主题
  const theme = useStorage("theme", defaultSettings.theme);
  
  const changeTheme = (val: string) => {
    theme.value = val;
    if (val === "light") {
      document.documentElement.classList.remove("dark");
    } else {
      document.documentElement.classList.add("dark");
    }
  };

  // 菜单是否折叠
  const isCollapse = useStorage("collapse", defaultSettings.isCollapse)

  const changeIsCollapse = (val: boolean)=>{
    isCollapse.value = val
  }

  // 头部是否固定
  const fixedHeader = useStorage("fixedHeader", defaultSettings.fixHeader)

  const changeFixedHeader = (val: boolean)=>{
    fixedHeader.value = val
  }

  // 是否显示页面标签
  const showTagView = useStorage("tagView", defaultSettings.showTagView)

  const changeTagView = (val: boolean)=>{
    showTagView.value = val
  }

  return {
    theme,
    changeTheme,
    isCollapse,
    changeIsCollapse,
    fixedHeader,
    changeFixedHeader,
    showTagView,
    changeTagView
  };
});
